﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/Template.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>L.A.G Studios</title>
<?php include "connect.php";
include "comment.class.php";
$comments = array();
$result = mysql_query("SELECT * FROM comments ORDER BY id ASC");

while($row = mysql_fetch_assoc($result))
{
	$comments[] = new Comment($row);
}

?>

<link rel="stylesheet" type="text/css" href="styles.css" />
<script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject.js"></script>
		<script type="text/javascript">
		<!--
		function GetUnity() {
			if (typeof unityObject != "undefined") {
				return unityObject.getObjectById("unityPlayer");
			}
			return null;
		}
		if (typeof unityObject != "undefined") {
			unityObject.embedUnity("unityPlayer", "WebPlayer.unity3d", 800, 600);
			
		}
		-->
		</script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>

    // This is the first thing we add ------------------------------------------
    $(document).ready(function() {
        
        $('.rate_widget').each(function(i) {
            var widget = this;
            var out_data = {
                widget_id : $(widget).attr('id'),
                fetch: 1
            };
            $.post(
                'ratings.php',
                out_data,
                function(INFO) {
                    $(widget).data( 'fsr', INFO );
                    set_votes(widget);
                },
                'json'
            );
        });
    

        $('.ratings_stars').hover(
            // Handles the mouseover
            function() {
                $(this).prevAll().andSelf().addClass('ratings_over');
                $(this).nextAll().removeClass('ratings_vote'); 
            },
            // Handles the mouseout
            function() {
                $(this).prevAll().andSelf().removeClass('ratings_over');
                // can't use 'this' because it wont contain the updated data
                set_votes($(this).parent());
            }
        );
        
        
        // This actually records the vote
        $('.ratings_stars').bind('click', function() {
            var star = this;
            var widget = $(this).parent();
            
            var clicked_data = {
                clicked_on : $(star).attr('class'),
                widget_id : $(star).parent().attr('id')
            };
            $.post(
                'ratings.php',
                clicked_data,
                function(INFO) {
                    widget.data( 'fsr', INFO );
                    set_votes(widget);
                },
                'json'
            ); 
        });
        
        
        
    });

    function set_votes(widget) {

        var avg = $(widget).data('fsr').whole_avg;
        var votes = $(widget).data('fsr').number_votes;
        var exact = $(widget).data('fsr').dec_avg;
    
        window.console && console.log('and now in set_votes, it thinks the fsr is ' + $(widget).data('fsr').number_votes);
        
        $(widget).find('.star_' + avg).prevAll().andSelf().addClass('ratings_vote');
        $(widget).find('.star_' + avg).nextAll().removeClass('ratings_vote'); 
        $(widget).find('.total_votes').text( votes + ' votes recorded (' + exact + ' rating)' );
    }
    </script>        
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
<style>

        .rate_widget {
            border:     1px solid #CCC;
            overflow:   visible;
            padding:    10px;
            position:   relative;
            width:      180px;
            height:     32px;
        }
        .ratings_stars {
            background: url('star_empty.png') no-repeat;
            float:      left;
            height:     28px;
            padding:    2px;
            width:      32px;
        }
        .ratings_vote {
            background: url('star_full.png') no-repeat;
        }
        .ratings_over {
            background: url('star_highlight.png') no-repeat;
        }
        .total_votes {
            background: #eaeaea;
            top: 58px;
            left: 0;
            padding: 5px;
            position:   absolute; 
            color: #000000; 
        } 
        .movie_choice {
            font: 10px verdana, sans-serif;
            margin: 0 auto 40px auto;
            width: 180px;
        }
<!--
		body {
			font-family: Helvetica, Verdana, Arial, sans-serif;
			background-color: black;
			color: white;
			text-align: center;
		}
		a:link, a:visited {
			color: #bfbfbf;
		}
		a:active, a:hover {
			color: #bfbfbf;
		}
		p.header {
			font-size: small;
			color: #000000;
		}
		p.header span {
			font-weight: bold;
		}
		p.footer {
			font-size: x-small;
		}
		div.content {
			position: relative;
			left: -200px;
			width: 800px;
		}
		div.missing {
			margin: auto;
			position: relative;
			top: 50%;
			width: 193px;
		}
		div.missing a {
			height: 63px;
			position: relative;
			top: -31px;
		}
		div.missing img {
			border-width: 0px;
		}
		div#unityPlayer {
			cursor: default;
			height: 600px;
			width: 800px;
		}
		-->
#banner {
	padding:0;
	margin:0;
	height: 250px;
	width:auto;
	background-image:url(Images/banner1.png);
	background-repeat:no-repeat;

}

body{
	padding:0;
	margin:0;
	background-color:#F0F0EE;
}
#main{
	padding-top:20px;
	padding-left:100px;
	padding-right:100px;
	min-height:500px;
	padding-bottom:20px;
	background-color:#F0F0EE;
}
#separator{
	background-image:url(Images/separator.jpg);
	height:145px;
}
.announcement{
	min-height:50px;
	padding-left:10px;
	padding-bottom:5px;
	border-bottom: 1px solid #DDD;
}
#footer{
	height:150px;;
	color:#999;
	font-size:10px;
	padding-top:50px;
	background-color:#F0F0EE;
	padding-left:100px;
	padding-right:100px;
}
#menu {
	height: 25px;
	padding-top: 45px;
	padding-bottom: 5px;
	text-align: center;
	border-bottom-style: none;
}
#menu #holder ul{
	list-style:none;
	text-align:center;
	margin:0;
	padding:0;
}
#menu #holder ul li a{
	text-decoration:none;
	float:left;
	margin-left: 150px;
	margin-right: 100px;
	font-family:"Arial Black", Gadget, sans-serif;
	color:#DDD;
	border:1px solid #993300;
	border-bottom: none;
	border-top:none;
	border-left:none;
	border-right:none;
	padding-right:5px;
	width:130px;
	text-align:center;
	display:block;
	-moz-border-radius-topleft:50px;
	-moz-border-radius-topright:50px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	font-size:22px;
}
#menu #holder ul li a:hover{
	text-shadow: 5px 5px 5px #000;	
	-moz-border-radius:50px;
}

.developers{
	float:left;
	border-left:1px solid #c8c1ad;
}
.dev{
	width: 340px;
	height:16px;
	margin-left:20px;
	display:block;
	line-height:140%;
}
.dev1{
	float: left;
	width: 200px;
	height:16px;
	margin:0 0 0 5px;
	font-weight:bold;
	line-height:140%;
}
.dev2{
	float: left;
	width: 132px;
	height:16px;
	font-weight:normal;
	line-height:140%;
}
a:link {
	text-decoration: none;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bolder;
}

.buybutton {
	float:right;
	margin-left:20px;
	margin-top:20px;
	padding-bottom: 25px;
	width:150px;
	height:50px;
}

.trybutton {
	float:right;
	margin-top:20px;
	padding-bottom: 25px;
	width:150px;
	height:50px;
}

.description {
	position: relative;
}

.about{
	width:500px;
	float:left;
	margin-right:20px;
}
.hr{
	background-color: #C8C1AD;
	height: 1px;
	margin: 20px 0px;
}
</style>
</head>

<body>
<div id="container">
	<div id="banner"> 
      <div id="menu">
      	<div id="holder">
        <ul>
        <li><a href="home.php">Home</a></li>
		<li><a href="about.php">About Us</a></li>
		<li><a href="games.php" class="mod" >Games</a></li>
        </u>
        </div>
        </div>
	</div>
    <div id="separator"></div>
    <div id="main"><!-- InstanceBeginEditable name="EditRegion3" -->
		<p class="header" style="text-align:center"><span>Created by L.A.G Studio | Space Bots</span></p>
        <br />
		<div class="content">
			<div id="unityPlayer">
				<div class="missing">
					<a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!">
						<img alt="Unity Web Player. Install now!" src="http://webplayer.unity3d.com/installation/getunity.png" width="193" height="63" />
					</a>
				</div>
			</div>
		</div>
        <br />
		<div class='movie_choice'>
		<div class="rate_widget">
		<div class="star_1 ratings_stars"></div>
		<div class="star_2 ratings_stars"></div>
		<div class="star_3 ratings_stars"></div>
		<div class="star_4 ratings_stars"></div>
		<div class="star_5 ratings_stars"></div>
		<div class="total_votes">vote data</div>
		</div>
		</div>
		<?php 
		foreach($comments as $c){
			echo $c->markup();
		}
		
		?>
		<div id="addCommentContainer">
			<p>Add a Comment</p>
			<form id="addCommentForm" method="post" action="">
		    	<div>
		        	<label for="name">Your Name</label>
		        	<input type="text" name="name" id="name" />
		            
		            <label for="email">Your Email</label>
		            <input type="text" name="email" id="email" />
		
		            
		            <label for="body">Comment Body</label>
		            <textarea name="body" id="body" cols="20" rows="5"></textarea>
		            
		            <input type="submit" id="submit" value="Submit" />
		        </div>
		    </form>
		</div>
		
		</div>
		
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="script.js"></script>
		
		<!-- InstanceEndEditable --></div>
    <div id="footer">
    <br />
    <hr />
    <font>COPYRIGHT © 2011 L.A.G STUDIOS PTE LTD. ALL RIGHTS RESERVED.!</font>
    <img src="Images/footer-icons.png" style="float:right" />
    </div>
</div>
</body>
<!-- InstanceEnd --></html>
